<?php $this->load->view('header'); ?>
<!--    <link href="--><?php //echo base_url() ?><!--app/css/css/token-input-facebook.css" rel="stylesheet" type="text/css"/>-->
<!--    <script type="text/javascript" src="--><?php //echo base_url() ?><!--app/js/jquery.tokeninput.js"></script>-->
<?php
if($msg = $this->session->flashdata('flash_message'))
{
    showMessage($msg['type'],$msg['msg']);
}
?>
    <div class="wrap-content wrap-content-app">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
                    <h3 class="page-header logo-app">Chi Tiết Dự Án</h3>
                </div>
                <form method="POST" id="form-project-post" enctype="multipart/form-data">
                <div class="col-lg-12">
                    <div class="col-lg-12 col-md-12 col-sm-12">
                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12 x8-15-b margin-top-bottom">
                            <div class="widgetText"><?php echo $this->lang->line('What work do you require');?></div>
                        </div>

                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12" style="margin-top:5px;">
                            <div class="col-lg-6 col-sm-12 col-md-12 col-xs-12 no-padding">
                                <select class="form-control groupCategories" name="group">
                                    <?php
                                        if(count($groupCategories) > 0){
                                            foreach($groupCategories as $item){
                                    ?>
                                    <option value="<?php echo $item['group_id'];?>" <?php echo set_select('group',$item['group_id'])?>><?php echo $item['group_name']?></option>
                                    <?php
                                            }
                                        }
                                    ?>

                                </select>
                            </div>
                        </div>

                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12 x8-15-b margin-top-bottom">
                            <div class="widgetText"><?php echo $this->lang->line('Project Name')?></div>
                        </div>

                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12" style="margin-top:5px;">
                            <div class="col-lg-6 col-sm-12 col-md-12 col-xs-12 no-padding">
                                <input type="text" name="project_name" id="project-name" class="form-control"
                                       placeholder="App Giao Thông" value="<?php echo set_value('project_name');?>"/>
                                <?php echo form_error('project_name')?>
                            </div>
                        </div>

                        <div class="col-lg-12 col-xs-12 col-sm-12 col-md-12 x8-15-b margin-top-bottom">
                            <div class="widgetText"><?php echo $this->lang->line('Enter some skills that relate to the project');?></div>
                        </div>

                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-top:5px;">
                            <div class="col-lg-6 col-sm-12 col-md-12 col-xs-12 no-padding">
                                <input class="form-control" placeholder="Objective-C" type="text"
                                       id="tags" value="<?php echo set_value("project_categories")?>" name="project_categories"/>
                                <?php echo form_error('project_categories')?>
                            </div>


                            <div class="col-lg-2 col-sm-12 col-md-12 col-xs-12 skill">
                                <div class="arrow-feedback col-lg-1 col-sm-1 col-md-1 colxs-1"></div>
                                <?php echo $this->lang->line('Add more skills')?>
                            </div>
                        </div>

                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 x8-15-b margin-top-bottom">
                            <div class="widgetText"><?php echo $this->lang->line('Project Description')?></div>
                        </div>

                        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-top:5px;">
                            <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12 no-padding">
                                <textarea class="form-control" id="project-description" name="description" placeholder="Bạn không đơn độc"
                                          rows="10" ><?php echo set_value('description');?></textarea>
                                <?php echo form_error('description')?>
                            </div>
                        </div>

                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12 no-padding margin-top-bottom">

                            <div class="fileinput fileinput-new col-lg-12 col-sm-12 col-md-12 col-xs-12"
                                 data-provides="fileinput">
                                <div class="btn btn-default btn-file"><span class="fileinput-new">Upload file</span>
                                    <span class="fileinput-exists">Change</span>
                                    <input type="file" name="attachment">
                                </div>
                                <div class="col-lg-12 col-sm-12 col-md-12">
                                    <div class="fileinput-filename col-lg-11 col-sm-12 col-md-12 col-xs-12"></div>
                                    <a href="#" class="close fileinput-exists" data-dismiss="fileinput"
                                       style="float: none">&times;</a>
                                </div>
                                <?php echo form_error('attachment');?>
                            </div>


                        </div>


                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
                            <div class="widgetText"><?php echo $this->lang->line('Budget')?></div>
                        </div>
                        <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12" style="margin-top:5px;">
                            <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12 vnd">
                                <select class="form-control">
                                    <option value="1">USD</option>
                                </select>
                            </div>
                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12 dan">
                                <select name="budget" id="budget" class="form-control">
                                    <option value="1" <?php echo set_select('budget',1,TRUE)?>><?php echo $this->lang->line('Simple Project')?></option>
                                    <option value="2" <?php echo set_select('budget',2)?>><?php echo $this->lang->line('Very Small Project')?></option>
                                    <option value="3" <?php echo set_select('budget',3)?>><?php echo $this->lang->line('Small Project')?></option>
                                    <option value="4" <?php echo set_select('budget',4)?>><?php echo $this->lang->line('Medium Project')?></option>
                                    <option value="5" <?php echo set_select('budget',5)?>><?php echo $this->lang->line('Large Project')?></option>
                                    <option value="6" <?php echo set_select('budget',6)?>><?php echo $this->lang->line('Larger Project')?></option>
                                    <option value="customize" <?php echo set_select('budget',"customize")?>><?php echo $this->lang->line('Customise Project')?></option>
                                </select>
                            </div>
                            <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12" style="display: none" id="customize_budget">
                                <span class="col-lg-12 col-md-12 col-sm-12 form-group" style="margin-top: 10px;"><?php echo $this->lang->line('Please specify custom budget');?></span>
                                <div class="col-lg-12 form-group">
                                    <label class="col-lg-3 control-label"><?php echo $this->lang->line('Customize budget min')?></label>
                                    <div class="col-lg-4">
                                        <input type="text" class="form-control" nam="customize_budget_min">

                                    </div>
                                </div>
                                <div class="col-lg-12 form-group">
                                    <label class="col-lg-3 control-label"><?php echo $this->lang->line('Customize budget max');?></label>
                                    <div class="col-lg-4">
                                        <input type="text" class="form-control" name="customize_budget_max">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div
                            class="col-lg-7 col-lg-offset-5 col-sm-offset-5 col-md-offset-5 col-sm-7 col-xs-7  col-md-7">
                            <button type="submit" name="createProject" value="createProject" class="btn btn-lg dang_du_an"><?php echo $this->lang->line('Post Project Now')?></button>
                        </div>
                    </div>
                </div>
                </form>
            </div>
        </div>
    </div>
<script type="text/javascript">
    $(document).ready(function () {
//        var group_id = $('.groupCategories option:selected').val();
//        skills_autocomplete(group_id);
//        $('.groupCategories').change(function(){
//            //$('.token-input-list').parent().remove();
//            var group_id = $('.groupCategories option:selected').val();
//            skills_autocomplete(group_id);
//        });
        if($('#budget option:selected').val() == 'customize'){
            $('#customize_budget').show();
        }else{
            $('#customize_budget').hide();
        }
//        $('#budget').change(function(){
//            if($('#budget option:selected').val() == 'customize'){
//                $('#customize_budget').show();
//            }else{
//                $('#customize_budget').hide();
//            }
//        });
        $("#form-project-post").validate({
                rules:{
                    "project_name" : {
                        required : true,
                        minlength:5
                    },
                    "project_categories" : {
                        required : true,
                        minlength : 5
                    },
                    "description" : {
                        required : true,
                        minlength :5
                    },
                    "customize_budget_min" : {
                        required : true
                    },
                    "customize_budget_max" : {
                        required : true,
                        min : $('#customize_budget_min').val()
                    }


                },
                messages:{
                    "project_name":{
                        required : "<?php echo $this->lang->line('Project Name')." ".$this->lang->line('required') ?>",
                        minlength : "<?php echo $this->lang->line('Project Name')." ".$this->lang->line('min_length'); ?>"
                    },
                    "project_categories":{
                        required : "<?php echo $this->lang->line('Project Skills')." ".$this->lang->line('required') ?>",
                        minlength : "<?php echo $this->lang->line('Project Skills')." ". $this->lang->line('min_length'); ?>"
                    },
                    "description":{
                        required : "<?php echo $this->lang->line('Project Description')." ".$this->lang->line('required') ?>",
                        minlength : "<?php echo $this->lang->line('Project Description')." ".$this->lang->line('min_length'); ?>"
                    },
                    "customize_budget_max" : {
                        required : "<?php echo $this->lang->line('Customize budget max')." ".$this->lang->line('required') ?>"
                    }
                }
            });



    });

    $(function() {
        var availableTags = [
            <?php
            if($categories->num_rows() > 0){
                foreach($categories->result() as $item){
                    echo '"'.$item->category_name.'",';
                }
            }
 ?>
        ];
        function split( val ) {
            return val.split( /,\s*/ );
        }
        function extractLast( term ) {
            return split( term ).pop();
        }
        $( "#tags" )
// don't navigate away from the field on tab when selecting an item
            .bind( "keydown", function( event ) {
                if ( event.keyCode === $.ui.keyCode.TAB &&
                    $( this ).autocomplete( "instance" ).menu.active ) {
                    event.preventDefault();
                }
            })
            .autocomplete({
                minLength: 0,
                source: function( request, response ) {
// delegate back to autocomplete, but extract the last term
                    response( $.ui.autocomplete.filter(
                        availableTags, extractLast( request.term ) ) );
                },
                focus: function() {
// prevent value inserted on focus
                    return false;
                },
                select: function( event, ui ) {
                    var terms = split( this.value );
// remove the current input
                    terms.pop();
// add the selected item
                    terms.push( ui.item.value );
// add placeholder to get the comma-and-space at the end
                    terms.push( "" );
                    this.value = terms.join( ", " );
                    return false;
                },
                _resizeMenu: function() {
                    this.menu.element.outerWidth( 600 );
                }
            });
    });
</script>
<!--    function skills_autocomplete(group_id){-->
<!--        $("#demo-input-facebook-theme").tokenInput(-->
<!--        "--><?php //echo base_url()."index.php/project/getRequestCategories?group_id=";?><!--"+group_id,{-->
<!--                onResult:function (results){-->
<!--                    $.each(results,function (index,value){-->
<!--                            value.name = value.category_name;-->
<!--                            value.id = value.category_name;-->
<!--                       });-->
<!--                         return results;-->
<!--                    },-->
<!--                    theme: "facebook",-->
<!--                    tokenLimit:5,-->
<!--                    preventDuplicates: true-->
<!--                });-->
<!--    }-->

<?php $this->load->view('footer'); ?>